<template>
  <div class="app-container customer-div">
<!--    <div style="font-size:14px;color:#606266;position: relative;z-index: 1">SAP更新日期：{{JDupdate}}</div>-->
    <el-menu :default-active="listQuery.tab" class="el-menu-demo" mode="horizontal" @select="handleSelect">
      <el-menu-item index="wait">销售合同 - 待处理</el-menu-item>
      <el-menu-item index="my">销售合同 - 我的</el-menu-item>
      <el-menu-item index="myDelaySettleOrder">销售合同 - 我的后结算</el-menu-item>
      <el-menu-item index="allDelaySettleOrder" v-if="allDelaySettleOrder">销售合同 - 全部后结算</el-menu-item>
<!--      <el-menu-item index="dept" v-if="isCanSaleByDept">部门订单</el-menu-item>-->
      <el-menu-item index="company" v-if="isAllSale">销售合同 - 全部</el-menu-item>
    </el-menu>

    <div style="margin-top: 40px">
      <!--搜索-->
      <el-form :inline="true" :model="listQuery" size="mini" label-width="140px">
        <div class="search-div">
          <el-collapse v-model="activeNames">
            <el-collapse-item title="常用搜索条件" name="1">
              <el-form-item label="客户名称：">
                <el-select
                  clearable
                  v-model="listQuery.customerId"
                  filterable
                  remote
                  reserve-keyword
                  placeholder="请输入关键词"
                  :remote-method="remoteMethod"
                  :loading="loading">
                  <el-option
                    v-for="item in customerList"
                    :key="item.customerId"
                    :label="item.customerName"
                    :value="item.customerId">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="订单编号：">
                <el-input v-model="listQuery.orderSn" style="width:150px;"></el-input>
              </el-form-item>
              <el-form-item label="合同流转状态：" v-if="listQuery.tab != 'wait'">
                <el-select v-model="listQuery.orderState" class="input-width" style="width:195px" placeholder="请选择" multiple>
                  <el-option :value="item.orderState" :label="item.text" :key="item.orderState" v-for="item in orderStateList"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="合同上传状态：">
                <el-select v-model="listQuery.hasUploadContract" placeholder="请选择" clearable style="width:100px">
                  <el-option :key="1" label="是" :value="1"></el-option>
                  <el-option :key="0" label="否" :value="0"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="支付状态：">
                <el-select v-model="listQuery.payState"  placeholder="请选择" clearable style="width:150px;">
                  <el-option :key="2" label="已结清" :value="2"></el-option>
                  <el-option :key="1" label="未结清" :value="1"></el-option>
                  <el-option :key="0" label="未支付" :value="0"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="财务状态：">
                <el-select v-model="listQuery.financeState"  placeholder="请选择" clearable style="width:100px" multiple>
                  <el-option key="0" label="未审核" value="0"></el-option>
                  <el-option key="1" label="已审核" value="1"></el-option>
                  <el-option key="2" label="已关闭" value="2"></el-option>
                  <el-option key="3" label="部分审核" value="3"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="开票状态：">
                <el-select v-model="listQuery.invoiceState"  placeholder="请选择" clearable style="width:100px" multiple>
                  <el-option key="0" label="未开票" value="0"></el-option>
                  <el-option key="1" label="部分开票" value="1"></el-option>
                  <el-option key="2" label="开票完成" value="2"></el-option>
                </el-select>
              </el-form-item>

              <el-form-item label="订单分类：">
                <el-select v-model="listQuery.orderCustomerType" multiple placeholder="请选择" clearable style="width:150px;">
                  <el-option
                    v-for="(item,index) in orderCustomerTypeList"
                    :key="index"
                    :label="item.cddValue"
                    :value="item.cddValue">
                  </el-option>
                </el-select>
              </el-form-item>

              <el-form-item label="后结算状态：">
                <el-select v-model="listQuery.delaySettleState" multiple placeholder="请选择" clearable style="width:150px;">
                  <el-option label="未申请结算" :value="0"></el-option>
                  <el-option label="部分申请结算" :value="10"></el-option>
                  <el-option label="全部申请结算" :value="20"></el-option>
                </el-select>
              </el-form-item>

              <el-form-item label="是否新客户：">
                <el-select v-model="listQuery.isNewCustomerOrder" placeholder="请选择" clearable style="width:100px">
                  <el-option :key="1" label="是" :value="1"></el-option>
                  <el-option :key="0" label="否" :value="0"></el-option>
                </el-select>
              </el-form-item>

              <el-form-item label="订单日期：">
                <el-date-picker
                  v-model="listQuery.createTime"
                  type="daterange"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </el-form-item>
            </el-collapse-item>
            <el-collapse-item title="高级搜索条件" name="2">
              <el-form-item label="客户编号：">
                <el-input v-model="listQuery.customerNumber" style="width:150px;"></el-input>
              </el-form-item>
              <el-form-item label="客户标签：" >
                <el-select v-model="listQuery.tagIds" clearable multiple>
                  <el-option
                    v-for="item in tagIdList"
                    :key="item.tagId"
                    :label="item.tagName"
                    :value="item.tagId">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="业务员：" v-if="listQuery.tab=='company' || (listQuery.tab=='my' && roleId == 30)">
                <el-select v-model="listQuery.userId" filterable placeholder="请选择" clearable>
                  <el-option
                    v-for="item in userOptionList"
                    :key="item.userId"
                    :label="item.userName"
                    :value="item.userId">
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="事业部：" v-if="listQuery.tab=='company'">
                <el-select v-model="listQuery.divsionDeptId"  placeholder="请选择" clearable>
                  <el-option :value="item.divsionDeptId" :label="item.divsionDeptName" :key="item.divsionDeptId" v-for="item in divisionList"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="部门：" v-if="listQuery.tab=='company'">
                <el-select v-model.number="listQuery.departmentId" class="input-width" style="width:150px" placeholder="请选择" clearable>
                  <el-option :value="item.departmentId" :label="item.departmentName" :key="item.departmentId" v-for="item in deptList"></el-option>
                </el-select>
              </el-form-item>

              <el-form-item label="支付方式：">
                <el-select v-model="listQuery.transactionType"  placeholder="请选择" clearable style="width:150px;">
                  <el-option key="BANK_PAY" label="银行汇款" value="BANK_PAY"></el-option>
                  <el-option key="COD_PAY" label="货到付款" value="COD_PAY"></el-option>
                  <el-option key="DEPOSIT_PAY" label="定金" value="DEPOSIT_PAY"></el-option>
                  <el-option key="XISHANG_PAY" label="锡商支付" value="XISHANG_PAY"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="是否确认函：">
                <el-select v-model="listQuery.confirmationLetter"  placeholder="请选择" clearable style="width:100px">
                  <el-option :key="1" label="是" :value="1"></el-option>
                  <el-option :key="0" label="否" :value="0"></el-option>
                </el-select>
              </el-form-item>

              <el-form-item label="是否为外贸订单：">
                <el-select v-model="listQuery.isChina"  placeholder="请选择" clearable style="width:100px">
                  <el-option :key="2" label="是" :value="2"></el-option>
                  <el-option :key="1" label="否" :value="1"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="是否支付逾期：">
                <el-select v-model="listQuery.needPayOutTime"  placeholder="请选择" clearable style="width:100px;">
                  <el-option :key="1" label="是" :value="1"></el-option>
                  <el-option :key="0" label="否" :value="0"></el-option>
                </el-select>
              </el-form-item>

              <el-form-item label="是否为预售订单：">
                <el-select v-model="listQuery.isPreorder" placeholder="请选择" clearable style="width:100px;">
                  <el-option :key="1" label="是" :value="1"></el-option>
                  <el-option :key="0" label="否" :value="0"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="取消类型：">
                <el-select v-model="listQuery.cancelTimeType"  placeholder="请选择" clearable style="width:150px;">
                  <el-option key="cancelToDay" label="当日取消" value="cancelToDay"></el-option>
                  <el-option key="cancelTwoDay" label="2日内取消" value="cancelTwoDay"></el-option>
                  <el-option key="cancelWeek" label="3-7天内取消" value="cancelWeek"></el-option>
                  <el-option key="cancelThanWeek" label="7天以上取消" value="cancelThanWeek"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="取消原因：">
                <el-select v-model="listQuery.cancelReasonType"  placeholder="请选择" clearable>
                  <el-option :value="item.cddId" :label="item.cddValue" :key="item.cddId" v-for="item in remarkList"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="是否后结算订单：">
                <el-select v-model="listQuery.isDelaySettleOrder" placeholder="请选择" clearable style="width:100px;">
                  <el-option :key="1" label="是" :value="1"></el-option>
                  <el-option :key="0" label="否" :value="0"></el-option>
                </el-select>
              </el-form-item>
              <el-form-item label="取消时间：">
                <el-date-picker
                  :default-time="['00:00:00', '23:59:59']"
                  v-model="listQuery.financeCancelDate"
                  type="daterange"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="实际支付日期：">
                <el-date-picker
                  :default-time="['00:00:00', '23:59:59']"
                  v-model="listQuery.payDate"
                  type="daterange"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </el-form-item>
              <el-form-item label="合同截止付款时间：">
                <el-date-picker
                  :default-time="['00:00:00', '23:59:59']"
                  v-model="listQuery.expectPayTime"
                  type="daterange"
                  format="yyyy 年 MM 月 dd 日"
                  value-format="yyyy-MM-dd HH:mm:ss"
                  range-separator="至"
                  start-placeholder="开始日期"
                  end-placeholder="结束日期">
                </el-date-picker>
              </el-form-item>

            </el-collapse-item>
          </el-collapse>
          <div style="text-align: right;padding-top:12px;">
            <el-button
              size="small"
              @click="handleSearchList()"
              type="primary">
              查询
            </el-button>
            <el-button
              size="small"
              v-if="(listQuery.tab=='company' || listQuery.tab=='allDelaySettleOrder') && saleExport"
              @click="downloadExcel()"
              type="primary">
              导出
            </el-button>
          </div>
        </div>

      </el-form>
    </div>

      <!--数据列表-->
    <div style="font-size:14px;line-height: 30px;padding:10px 0 ">
      合同总数：<span style="font-weight: bold">{{statisticsCount }}</span>
      <span style="padding-left:20px;">合同金额：</span><span style="font-weight: bold">{{statisticsAmount }}</span>
      <span style="padding-left:20px;">商品数量：</span><span style="font-weight: bold">{{statisticsGoodsNum }}</span>
      <span style="padding-left: 10px;color:REd">自提订单流转完成后请下载
        【<span style="cursor: pointer;text-decoration: underline;color:#409eff;" @click="openFlie('pickupNoticeFile')">自提货物提醒及自检通知单</span>】与【<span style="cursor: pointer;text-decoration: underline;color:#409eff;" @click="openFlie('deliverNoticeFile')">装运注意事项 </span>】并即时发送给客户!
      </span>
    </div>
    <div class="table-container">
        <el-table
          v-loading="listLoading"
          :data="tableData"
          border
          style="width: 100%; margin-top: 20px">
          <el-table-column
                  fixed="left"
                  label="订单日期"
                  width="150"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.createTime}}
            </template>
          </el-table-column>
          <el-table-column  label="订单号" width="250" prop="orderSn" fixed="left">
            <template slot-scope="scope">
              <div>
                <el-link v-if="(scope.row.orderState == 0 || scope.row.orderState == 12 || scope.row.orderState == 28 || scope.row.orderState == 30) && listQuery.tab != 'company'"
                         @click="toDetail('edit',scope.row)" type="primary" style="font-size:12px;vertical-align: middle">
                  {{scope.row.orderSn}}
                </el-link>
                <el-link v-else
                         @click="toDetail('see',scope.row)" type="primary" style="font-size:12px;vertical-align: middle">
                  {{scope.row.orderSn}}
                </el-link>
                <span v-if="scope.row.isEntrust == 1" style="display: inline-block;width:22px;line-height: 18px;background: green;color:#fff;font-size:12px;border-radius: 4px;text-align: center">投</span>
                <img src="../../assets/images/moresu.png" style="vertical-align: middle;" v-if="scope.row.moresuSn != ''"/>
                <img src="../../assets/images/zhuofei2.png" v-if="scope.row.orderState == 10" style="vertical-align: middle;"/>
                <img src="../../assets/images/bian.png" v-if="scope.row.isRestart" style="vertical-align: middle;"/>
                <img src="../../assets/images/yue.png" v-if="scope.row.isTimeSure == 1" style="vertical-align: middle;"/>
                <img src="../../assets/images/xianshang.png" v-if="scope.row.isMoresuOnlineOrder == 1"  style="vertical-align: middle;"/>
                <img src="../../assets/images/ya.png" v-if="scope.row.isEnableYunLink == 1"  style="vertical-align: middle;"/>
                <img src="../../assets/images/dui.png" v-if="scope.row.isZ == 1"  style="vertical-align: middle;"/>
                <img src="https://pic.moresu.com/FgZkvAbP27TK55QAyRIOU3t0mmoC" v-if="scope.row.isHasCostOrder == 1"  style="vertical-align: middle;"/>
                <img src="https://pic.moresu.com/FhIaQcrC8Mbtqn9EmG4uteNBibd7" v-if="scope.row.activityType == 'paiMai'"  style="vertical-align: middle;width:16px;"/>
                <img src="https://pic.moresu.com/Frk-59w7qGLTVZm7uWljVJtYo3iI" v-if="scope.row.activityType == 'seckill'"  style="vertical-align: middle;width:16px;"/>
                <img src="https://pic.moresu.com/Fgzo3ZwcBvgroKhAirVh8nYHz-6y" v-if="scope.row.confirmationLetter == 1" style="vertical-align: middle;width:16px;"/>
                <img src="https://pic.moresu.com/Fiefnpx3gUKVKhH8t7zFB8chTnSY" v-if="scope.row.isIntentionOrder == 1" style="vertical-align: middle;"/>
                <img src="https://pic.moresu.com/Fm17IfpE4F4iv84Pagh8x1RmVdDw" v-if="scope.row.isPreorder == 1" style="vertical-align: middle;"/>
                <span v-if="scope.row.isDelaySettleOrder == 1" style="vertical-align:middle;display: inline-block;width:auto;padding:0 3px;line-height: 18px;background: green;color:#fff;font-size:10px;border-radius: 4px;text-align: center">后结算</span>
              </div>
            </template>
          </el-table-column>
          <el-table-column
                  label="合同截止付款时间"
                  width="150"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.expectPayTime}}
            </template>
          </el-table-column>
          <el-table-column

                  label="是否超期"
                  width="100"
                  align="center">
              <template slot-scope="scope">
                <span v-if="scope.row.remainPayHours == 1" style="color:sandybrown">
                    1小时后超期
                </span>
                <span v-else-if="scope.row.remainPayHours == 2" style="color:sandybrown">
                    2小时后超期
                </span>
                <span v-else-if="scope.row.remainPayHours == 3" style="color:sandybrown">
                    3小时后超期
                </span>
                <span v-else-if="scope.row.remainPayHours <= 0" style="color:red">
                    是
                </span>
                <span v-else >
                    否
                </span>
              </template>
          </el-table-column>

          <el-table-column
                  label="支付状态"
                  width="100"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.payState | fiferPayState}}
            </template>
          </el-table-column>

          <el-table-column
                  label="支付日期"
                  width="130"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.payTime}}
            </template>
          </el-table-column>
          <el-table-column
            fixed="left"
            label="客户编号"
            width="300">
            <template slot-scope="scope">
              <el-link @click="toCustomerDetail(scope.row)" type="primary" v-if="listQuery.tab != 'company'" style="font-size:12px">
                {{scope.row.customerNumber }}
              </el-link>
              <span v-else>
                {{scope.row.customerNumber }}
              </span>
              <!--是否有权限-->
              <div v-if="scope.row.isShowCustomerName">{{scope.row.customerName}}</div>
            </template>
          </el-table-column>
          <el-table-column
                  fixed="left"
                  header-align="center"
                  label="客户标签"
                  width="150">
            <template slot-scope="scope">
              <el-tooltip placement="bottom" effect="light">
                <div slot="content" style="max-width: 400px"> <crm-tag :item="item" v-for="item in scope.row.customerTag" :key="item.tagName" style="margin-bottom:4px;margin-right:4px"></crm-tag></div>
                <div style="padding:0 10px;width:100%; white-space: nowrap;  overflow: hidden; text-overflow: ellipsis;">
                    <crm-tag :item="item" v-for="item in scope.row.customerTag" :key="item.tagName" style="margin-bottom:4px;margin-right:4px"></crm-tag>
                </div>
              </el-tooltip>

            </template>
          </el-table-column>

          <el-table-column
            prop="userName"
            label="业务员"
            width="100"
            align="center">
          </el-table-column>
          <el-table-column
            prop="orderGoodsNumber"
            label="合同数量"
            width="100"
            align="center">
          </el-table-column>

          <el-table-column
            prop="orderGoodsInvoiceNum"
            label="开票数量"
            width="100"
            align="center">
          </el-table-column>


          <el-table-column
            label="摩叔运费"
            width="100"
            align="center">
            <template slot-scope="scope">
                {{scope.row.freight}}
            </template>
          </el-table-column>
          <el-table-column
            label="合同金额"
            width="100"
            align="center">
            <template slot-scope="scope">
              {{scope.row.orderAmount}}
            </template>
          </el-table-column>
          <el-table-column
            label="已收款"
            width="100"
            align="center">
            <template slot-scope="scope">
              {{scope.row.paidAmount}}
            </template>
          </el-table-column>
          <el-table-column
            label="未收款"
            width="100"
            align="center">
            <template slot-scope="scope">
              {{scope.row.unPaidAmount }}
            </template>
          </el-table-column>
          <el-table-column
            label="退款"
            width="100"
            align="center">
            <template slot-scope="scope">
              {{scope.row.deliverAmount}}
            </template>
          </el-table-column>
          <el-table-column
                  label="预估利润"
                  width="100"
                  align="center">
            <template slot-scope="scope">
                {{scope.row.orderState != 0 && scope.row.orderState != 20 ? scope.row.saleProfit : '--'}}
            </template>
          </el-table-column>
          <el-table-column
                  label="贷款金额"
                  width="100"
                  align="center">
            <template slot-scope="scope">
                {{scope.row.loanAmount }}
            </template>
          </el-table-column>
          <el-table-column
                  label="还款到期时间"
                  width="100"
                  align="center">
            <template slot-scope="scope">
                {{scope.row.repaymentDueDate }}
            </template>
          </el-table-column>
          <el-table-column
                  label="已还款金额"
                  width="100"
                  align="center">
            <template slot-scope="scope">
                {{scope.row.repaidAmount }}
            </template>
          </el-table-column>
          <el-table-column
                  label="未还款金额"
                  width="100"
                  align="center">
            <template slot-scope="scope">
                {{scope.row.noRepaidAmount }}
            </template>
          </el-table-column>
          <el-table-column
                  label="还款状态"
                  width="100"
                  align="center">
            <template slot-scope="scope">
                {{scope.row.repaidStatus | filterRepaid}}
            </template>
          </el-table-column>
          <el-table-column
                  label="还款完成时间"
                  width="100"
                  align="center">
            <template slot-scope="scope">
                {{scope.row.repaymentFinishDate?scope.row.repaymentFinishDate:"--"}}
            </template>
          </el-table-column>
          <el-table-column
                  align="center"
                  label="财务状态"
                  width="80">
            <template slot-scope="scope">
              {{scope.row.financeState}}
            </template>
          </el-table-column>
          <el-table-column
                  align="center"
                  label="合同上传状态"
                  width="120">
            <template slot-scope="scope">
              {{scope.row.hasUploadContract == 1 ? '是' : '否'}}
            </template>
          </el-table-column>
          <el-table-column
                  label="支付方式"
                  width="100"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.transactionType | fiftransactionType}}
            </template>
          </el-table-column>
          <el-table-column
            label="财务审核时间"
            width="150"
            align="center">
            <template slot-scope="scope">
              {{scope.row.financeConfirmTime }}
            </template>
          </el-table-column>
          <el-table-column
            label="订单种类"
            width="100"
            align="center">
            <template slot-scope="scope">
              {{scope.row.isChina}}
            </template>
          </el-table-column>
          <el-table-column
            label="订单分类"
            width="100"
            align="center">
            <template slot-scope="scope">
              {{scope.row.orderCustomerType}}
            </template>
          </el-table-column>
          <el-table-column
                  fixed="right"
                  label="合同流转状态"
                  width="130"
                  align="center">
            <template slot-scope="scope">
              {{scope.row.orderStateStr}}
            </template>
          </el-table-column>
          <el-table-column
            label="取消时间"
            width="130"
            align="center">
            <template slot-scope="scope">
              {{scope.row.financeCancelTime}}
            </template>
          </el-table-column>
          <el-table-column
                  width="150"
            fixed="right"
            label="操作"
            align="center">
            <template slot-scope="scope">
              <el-button
                v-if="scope.row.isIntentionOrder == 1 && listQuery.tab != 'company' && scope.row.orderState == 0 "
                type="text"
                size="mini"
                @click="showCancelOrder(1,scope.row)">取消意向合同
              </el-button>
              <el-button
                v-if="scope.row.orderState > 0  && scope.row.orderState != 10 && listQuery.tab != 'company' && scope.row.financeState != '已关闭'"
                type="text"
                size="mini"
                @click="showCancelOrder(0,scope.row)">取消正式合同
              </el-button>
              <el-button
                v-if="scope.row.orderState != 0 && scope.row.orderState != 30 || listQuery.tab == 'company' "
                type="text"
                size="mini"
                @click="toDetail('see',scope.row)">查看详情
              </el-button>
              <el-upload
                v-if="(scope.row.orderState == 40 || scope.row.orderState == 10) && scope.row.hasUploadContract == 0"
                action="https://upload.qiniup.com"
                :show-file-list="false"
                style="display: inline-block"
                :http-request="function (upload) { return sliderRequest(upload,scope.row)}">
                <el-button size="small" type="text" :loading="btnLoading">上传合同附件</el-button>
              </el-upload>
              <el-button
                v-if="scope.row.isCanApplySettle"
                type="text"
                size="mini"
                @click="toSettlement(scope.row)">发起结算
              </el-button>
              <el-dropdown trigger="click" size="mini">
                <span class="el-dropdown-link" style="cursor: pointer;color: #409EFF;font-size:12px">更多设置 <i class="el-icon-arrow-down el-icon--right"></i></span>
                <el-dropdown-menu slot="dropdown">
<!--                  <el-dropdown-item>-->
<!--                    <el-button-->
<!--                      style="width:100%"-->
<!--                      v-if=" listQuery.tab == 'company' && yunLinkOrderConfirm"-->
<!--                      type="text"-->
<!--                      size="mini"-->
<!--                      @click="changeOrderType(scope.row)">修改成质押单-->
<!--                    </el-button>-->
<!--                  </el-dropdown-item>-->
                  <el-dropdown-item>
                    <el-button
                      style="width:100%"
                      v-if=" listQuery.tab == 'company' && yunLinkOrderConfirm"
                      type="text"
                      size="mini"
                      @click="showorderForm(scope.row)">关联采购单号
                    </el-button>
                  </el-dropdown-item>
                  <el-dropdown-item>
                    <el-button
                      style="width:100%"
                      v-if="scope.row.orderState == 0 && listQuery.tab != 'company'"
                      type="text"
                      size="mini"
                      @click="toDetail('edit',scope.row)">确认
                    </el-button>
                  </el-dropdown-item>
                  <el-dropdown-item>
                    <el-button
                      style="width:100%"
                      v-if="scope.row.orderState == 30 && listQuery.tab != 'company'"
                      type="text"
                      size="mini"
                      @click="toDetail('edit',scope.row)">二次确认
                    </el-button>
                  </el-dropdown-item>
<!--                  <el-dropdown-item>-->
<!--                    <el-button-->
<!--                      style="width:100%"-->
<!--                      type="text"-->
<!--                      size="mini"-->
<!--                      @click="showjieshaoForm(scope.row)">推荐人-->
<!--                    </el-button>-->
<!--                  </el-dropdown-item>-->
<!--                  <el-dropdown-item>-->
<!--                    <el-button type="text" @click="setIsEntrust(scope.row)" v-if="changeOrderIsEntrust && scope.row.isEntrust == 2"  style="width:100%">设为投委会订单</el-button>-->
<!--                  </el-dropdown-item>-->
<!--                  <el-dropdown-item>-->
<!--                    <el-button type="text" @click="setIsEntrust(scope.row)" v-if="changeOrderIsEntrust && scope.row.isEntrust == 1"  style="width:100%">取消投委会订单</el-button>-->
<!--                  </el-dropdown-item>-->
                  <el-dropdown-item>
                    <el-button type="text" @click="showpop(scope.row)"  style="width:100%">新增售后</el-button>
                  </el-dropdown-item>
                  <el-dropdown-item>
                    <el-button type="text" v-if="scope.row.isCanCheck==1" @click="updateSettlement('see',scope.row)"  style="width:100%">查看更改申请</el-button>
                  </el-dropdown-item>
                  <el-dropdown-item>
                    <el-button type="text" v-if="scope.row.isCanCheck==2 " @click="updateSettlement('check',scope.row)"  style="width:100%">申请更改结算方式</el-button>
                  </el-dropdown-item>
                  <el-dropdown-item>
                    <el-button type="text" v-if="editOrderCustomerType " @click="seeOrderType(scope.row)"  style="width:100%">订单分类修改</el-button>
                  </el-dropdown-item>
                  <el-dropdown-item>
                    <el-button type="text" v-if="scope.row.isCanDelaySendApply==1 " @click="applyClosure(scope.row)"  style="width:100%">申请预售订单延期</el-button>
                  </el-dropdown-item>
                  <el-dropdown-item>
                    <el-button type="text" v-if="scope.row.isBatchPaid!=1 &&  scope.row.orderState != 10 && listQuery.tab == 'company'" @click="editBatchPaid(scope.row)"  style="width:100%">修改分批发货</el-button>
                  </el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </template>
          </el-table-column>
        </el-table>
      </div>
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        layout="total, sizes,prev, pager, next,jumper"
        :current-page.sync="listQuery.pageNum"
        :page-size="listQuery.pageSize"
        :page-sizes="[10,15,20]"
        :total="count">
      </el-pagination>
    </div>
    <!--推荐人-->
    <el-dialog
      :close-on-click-modal="false"
      title="设置推荐人"
      :visible.sync="dialogVisible"
      width="420px">
      <el-form :model="jieshaoForm" size="mini" label-width="120px" ref="jieshaoForm" >
        <el-form-item label="推荐人：">
          <el-select v-model="jieshaoForm.introducerId" filterable placeholder="请选择" value-key="realName" clearable>
            <el-option
              v-for="item in introducerList"
              :key="item.introducerId"
              :label="item.introducerName+'('+item.introducerMobile + ')'"
              :value="item.introducerId">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose">取 消</el-button>
        <el-button type="primary" @click="handleConfirm" :loading="btnLoading2">确 定</el-button>
      </span>
    </el-dialog>
    <!--关联采购单号-->
    <el-dialog
      :close-on-click-modal="false"
      title="关联采购单号"
      :visible.sync="dialogVisibleOrder"
      width="420px">
      <el-form :model="orderForm" size="mini" label-width="120px" ref="orderForm" :rules="rules">
        <el-form-item label="采购单号：">
              <el-input v-model="orderForm.purchaseOrderSn"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose3">取 消</el-button>
          <el-button type="primary" @click="handleConfirm3" :loading="btnLoading3">确 定</el-button>
      </span>
    </el-dialog>
    <!-- 新增售后 -->
    <addSh ref="addSh" @getList="getList"></addSh>
    <!-- 申请更改结算方式 -->
    <updateSettlement ref="updateSettlement" @upload="getList"></updateSettlement>

    <!-- 取消意向合同 -->
    <cancelOrder ref="cancelOrder" @update="getList"></cancelOrder>

    <!--修改订单分类-->
    <el-dialog
      :close-on-click-modal="false"
      title="修改订单分类"
      :visible.sync="orderTypeShow"
      width="420px">
      <el-form :model="orderTypeForm" size="mini" label-width="120px" ref="orderTypeForm" :rules="rules4">
        <el-form-item label="订单分类：" prop="orderCustomerType">
          <el-select v-model="orderTypeForm.orderCustomerType" placeholder="请选择" >
            <el-option
              v-for="(item,index) in orderCustomerTypeList"
              :key="index"
              :label="item.cddValue"
              :value="item.cddValue">
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
          <el-button @click="handleClose4">取 消</el-button>
          <el-button type="primary" @click="handleConfirm4" :loading="orderTypeLoading">确 定</el-button>
      </span>
    </el-dialog>

    <!-- 申请预售订单延期关闭 -->
    <delayClosure ref="delayClosure" @upload="getList"></delayClosure>

    <!--后结算申请-->
    <postSettlement ref="postSettlement" @update="getList"></postSettlement>
  </div>
</template>
<script>
import axios from 'axios'
import {
  getCustomerOption,
  getUserOption,
  myDeptList,
  saleOrderList,
  getOrderStatList,
  getOrderUsersList,
  getKingInfo,
  uploadOrderImg,
  getQiniuToken,
  setIntroducerInfo,
  customerIntroducerList,
  getCustomerSetting,
  changeOrderShouXing,
  guanglianOrderShouXing,
  changeEntrust,
  xsRepayment,
  getConfigList,editOrderCustomerType
} from '@/api/partner'
import {tagConfigList} from '@/api/company';
import {formatDate} from '@/utils/date';
import store from '@/store'
import { mapGetters } from 'vuex'
import addSh from './components/addSh'
import updateSettlement from './components/updateSettlement.vue'
import {divisionDeptList} from '@/api/company'
import cancelOrder from './components/cancelOrder'
import delayClosure from './components/delayClosure'
import clSh from "./components/clSh";
import crmTag from "@/views/components/crmTag";
import {inquiryTips} from '@/api/order'
import postSettlement from './components/postSettlement'
import {editOrderInfo} from '@/api/fms'
    const defaultListQuery={
      pageNum: 1,
      pageSize: 10,
      keywords: '',
      createTime:null,
      orderState:[],
      tab:'wait',
      orderSn:'',
      userId:null,
      type:'sale',
      isRestart:null,
      payState:null,
      payDate:null,
      financeState:[],
      hasUploadContract:null,
      expectPayTime:null,
      isProcessBack:null,
      cancelTimeType:null,
      cancelReasonType:null,
      payTimeType:null,
      transactionType:null,
      remainPayHours:null,
      isSpecialOrder:null,
      isTimeSure:null,
      introducerType:null,
      introducerName:null,
      isMoresuOnlineOrder:null,
      isMoresuNeedCheck:null,
      isDefendOrder:null,
      activityType:'',
      isHasIntroducer:'',
      isEntrust:'',
      isChina:'',
      confirmationLetter:'',
      financeConfirmDate:[],
      financeCancelDate:[],
      checkedCancelDate:[],
      repaidStatus:'',
      customerNumber:'',
      divsionDeptId:'',
      needPayOutTime:'',
      orderCustomerType:[],
      isPreorder:'',
      tagIds:[],
      customerId:'',
      invoiceState:[],
      isDelaySettleOrder:'',
      delaySettleState:[],
      isNewCustomerOrder:''
    };
    const defaultorderTypeForm={
      orderId:'',
      orderCustomerType:'',
    }
    export default {
      name: "index",
      data(){
        return {
          creator:'',
          listQuery: JSON.parse(JSON.stringify(defaultListQuery)),
          tableData: [],
          count: 0,
          listLoading: false,
          customerStateList: [],
          userOptionList:[],
          roles:store.getters.roles ? store.getters.roles : [],
          deptList:[],
          orderStateList:[],
          // JDupdate:'',
          listAmount:0,
          statisticsCount:0,
          statisticsAmount:0,
          statisticsGoodsNum:0,
          contractUrl:'',
          uploadToken:{
            token:'',
          },
          imgDomain:'',
          btnLoading:false,
          dialogVisible:false,
          btnLoading2:false,
          jieshaoForm:{
            customerId:'',
            introducerId:'',
          },
          introducerList:[],
          remarkList:[],
          dialogVisibleOrder:false,
          orderForm:{
            orderId:'',
            purchaseOrderSn:'',
          },
          rules:{
            purchaseOrderSn:[{required: true, message: '此项必填', trigger: 'blur'},],
          },
          btnLoading3:false,
          btnLoading4:false,
          roleId:'',
          divisionList:[],
          orderCustomerTypeList:[],
          orderTypeForm:JSON.parse(JSON.stringify(defaultorderTypeForm)),

          orderTypeShow:false,
          orderTypeLoading:false,
          rules4:{
            orderCustomerType:[{required: true, message: '此项必填', trigger: 'change'},],
          },
          pickupNoticeFile:'',
          deliverNoticeFile:'',
          customerList:[],
          tagIdList:[],
          loading:false,
          activeNames:['1','2']
        }
      },
  components: {
    addSh,
    updateSettlement,
    cancelOrder,
    crmTag,
    delayClosure,
    postSettlement
  },
  computed: {
        ...mapGetters([
          'name',
          'mobile',
          'userId'
        ]),
        isAllSale(){
          if(this.roles.indexOf("allSale") != -1){
            return true
          }else{
            return false
          }
        },
        isCanSpecialOrder(){
          if(this.roles.indexOf("specialOrder") != -1){
            return true
          }else{
            return false
          }
        },
        saleExport(){
          if(this.roles.indexOf("saleExport") != -1){
            return true
          }else{
            return false
          }
        },
        yunLinkOrderConfirm(){
          if(this.roles.indexOf("yunLinkOrderConfirm") != -1){
            return true
          }else{
            return false
          }
        },
        changeOrderIsEntrust(){
          if(this.roles.indexOf("changeOrderIsEntrust") != -1){
            return true
          }else{
            return false
          }
        },
        editOrderCustomerType(){
          if(this.roles.indexOf("editOrderCustomerType") != -1){
            return true
          }else{
            return false
          }
        },
        allDelaySettleOrder(){
          if(this.roles.indexOf("allDelaySettleOrder") != -1){
            return true
          }else{
            return false
          }
        },
  },
  created() {
        if(localStorage.getItem('userInfo')){
          var userInfo = JSON.parse(localStorage.getItem('userInfo'))
          this.roleId = userInfo.data.subscriberInfo.roleId
        }
        if (localStorage.getItem('saleListQuery')){
          this.listQuery = JSON.parse(localStorage.getItem('saleListQuery'));
          localStorage.removeItem('saleListQuery');
        }
        if(this.$route.query.type){
          let start = new Date(new Date(new Date().getTime()).setHours(0,0,0,0));
          let end = new Date(new Date(new Date().toLocaleDateString()).getTime() +24 * 60 * 60 * 1000 -1);
          switch (this.$route.query.type) {
            case 'my':
              this.listQuery.tab = 'my';
              break;
            case 'myToday':
              this.listQuery.tab = 'my';
              this.listQuery.createTime = [formatDate(start, 'yyyy-MM-dd'),formatDate(end, 'yyyy-MM-dd')];
              break;
            case 'myWait':
              this.listQuery.tab = 'wait';
              break;
            case 'my40':
              this.listQuery.tab = 'my';
              this.listQuery.orderState = ['40'];
              break;
            case 'myToday40':
              this.listQuery.tab = 'my';
              this.listQuery.orderState = ['40'];

              this.listQuery.createTime = [formatDate(start, 'yyyy-MM-dd'),formatDate(end, 'yyyy-MM-dd')];
              break;
            case 'my10':
              this.listQuery.tab = 'my';
              this.listQuery.orderState = ['10'];
              break;
            case 'all':
              this.listQuery.tab = 'company';
              break;
            case 'allToday':
              this.listQuery.tab = 'company';
              this.listQuery.createTime = [formatDate(start, 'yyyy-MM-dd'),formatDate(end, 'yyyy-MM-dd')];
              break;
            case 'allWait':
              this.listQuery.tab = 'company';
              this.listQuery.orderState = ['0','30'];
              break;
            case 'all40':
              this.listQuery.tab = 'company';
              this.listQuery.orderState = ['40'];
              break;
            case 'allToday40':
              this.listQuery.tab = 'company';
              this.listQuery.orderState = ['40'];
              this.listQuery.createTime = [formatDate(start, 'yyyy-MM-dd'),formatDate(end, 'yyyy-MM-dd')];
              break;
            case 'all10':
              this.listQuery.tab = 'company';
              this.listQuery.orderState = ['10'];
              break;
            case 'orders':
              this.listQuery.tab = 'my';
              this.listQuery.keywords = this.$route.query.keywords;
              break;
            case 'cancelAll':
              this.listQuery.tab = 'my';
              this.listQuery.orderState = ['10'];
              this.listQuery.keywords = this.$route.query.keywords;
              break;
            case 'cancelToDay':
            case 'cancelTwoDay':
            case 'cancelWeek':
            case 'cancelThanWeek':
              this.listQuery.tab = 'my';
              this.listQuery.orderState = ['10'];
              this.listQuery.keywords = this.$route.query.keywords;
              this.listQuery.cancelTimeType = this.$route.query.type;
              break;
            case 'cancelByPriceReduction':
            case 'cancelByWeCompanyReason':
            case 'cancelByOtherReason':
              this.listQuery.tab = 'my';
              this.listQuery.orderState = ['10'];
              this.listQuery.keywords = this.$route.query.keywords;
              this.listQuery.cancelReasonType = this.$route.query.type;
              break;
            case 'payAll':
              this.listQuery.tab = 'my';
              this.listQuery.financeState = 1;
              this.listQuery.keywords = this.$route.query.keywords;
              break;
            case 'payToDay':
            case 'payOneDay':
            case 'payTwoDay':
            case 'payThreeDay':
              this.listQuery.tab = 'my';
              this.listQuery.financeState = 1;
              this.listQuery.keywords = this.$route.query.keywords;
              this.listQuery.payTimeType  = this.$route.query.type;
              break;
            case 'payNo':
              this.listQuery.tab = 'my';
              this.listQuery.financeState = 0;
              this.listQuery.keywords = this.$route.query.keywords;
              break;
          }
        }
        if(this.$route.query.dataTab){
          this.listQuery.tab = this.$route.query.dataTab == 'my' ? 'my' :'company'
        }
        if(this.$route.query.dataDate){
          this.listQuery.createTime = this.$route.query.dataDate
        }
        if(this.$route.query.dataOrderState){
          this.listQuery.orderState = [this.$route.query.dataOrderState]
        }
        if(this.$route.query.dataHasUploadContract){
          this.listQuery.hasUploadContract = Number(this.$route.query.dataHasUploadContract)
        }
        if(this.$route.query.dataPayState){
          this.listQuery.payState = Number(this.$route.query.dataPayState)
        }
        if(this.$route.query.dataNeedPayOutTime){
          this.listQuery.needPayOutTime = Number(this.$route.query.dataNeedPayOutTime)
        }
        if(this.$route.query.dataFinanceState){
          this.listQuery.financeState = [this.$route.query.dataFinanceState]
        }
        if(this.$route.query.dataInvoiceState){
          this.listQuery.invoiceState = [this.$route.query.dataInvoiceState]
        }
        if(this.$route.query.tab){
          this.listQuery.tab = this.$route.query.tab;
        }
        if(this.$route.query.createTime){
          this.listQuery.createTime = this.$route.query.createTime.split(',')
        }
        if(this.$route.query.hasUploadContract){
          this.listQuery.hasUploadContract = parseInt(this.$route.query.hasUploadContract);
        }
        if(this.$route.query.isNewCustomerOrder){
          this.listQuery.isNewCustomerOrder = parseInt(this.$route.query.isNewCustomerOrder);
        }
        if(this.$route.query.orderState){
          this.listQuery.orderState = this.$route.query.orderState.split(',')
        }
        if(this.$route.query.orderCustomerType){
          this.listQuery.orderCustomerType = [this.$route.query.orderCustomerType]
        }
        this.getList();
        this.getUserOptionList();
        this.getDeptList();
        this.getOrderStatListData();
        this.getUploadToken();
        this.getRemarkList();
        this.getDivisionDeptList()
        this.getOrderCustomerType()
        this.getSelConfigList()
        // getKingInfo().then((res)=>{
        //   this.JDupdate = res.orderUpdateTime;
        // })
    inquiryTips().then((res)=>{
      this.pickupNoticeFile = res.pickupNoticeFile
      this.deliverNoticeFile = res.deliverNoticeFile
    })

  },
  filters: {
        formatCreateTime(time) {
          if(time){
            let date = new Date(time);
            return formatDate(date, 'yyyy-MM-dd hh:mm:ss')
          }else{
            return '--'
          }
        },
        fiferPayState(val){
          if(val == 0){
            return '--'
          }else if(val == 1){
            return '未结清'
          }else if(val == 2){
            return '已结清'
          }
        },
        fiftransactionType(val){
          if(val == 'BANK_PAY'){
            return '银行汇款'
          }else if(val == 'COD_PAY'){
            return '货到付款'
          }else if(val == 'DEPOSIT_PAY'){
            return '定金'
          }else if(val == 'XISHANG_PAY'){
            return '锡商支付'
          }else{
            return '其它'
          }
        },
        filterIsChina(val){
          if(val== 2){
            return '外贸'
          } else if(val == 1){
            return '内销'
          }
        },
        fifIntroducerType(val){
          if(val == 1){
            return '外部人员'
          }else if(val == 2){
            return '内部人员'
          }
        },
        filterRepaid(val){
          if(val == 1){
            return '未还清'
          }else if(val == 2){
            return '已还清'
          } else {
            return '未贷款'
          }
        },
  },
  methods: {
    editBatchPaid(item){
      editOrderInfo({orderId:item.orderId,isBatchPaid:1}).then((res)=>{
         let text = '订单'+item.orderSn+'已修改为【分批发货】'
         this.$message.success('操作成功')
         this.getList();
      })
    },
    //结算申请
    toSettlement(item){
       this.$refs.postSettlement.showPop(item)
    },
    getSelConfigList(){
      tagConfigList().then((res)=>{
        this.tagIdList = res
      })

    },
    //查询获取客户列表
    remoteMethod(query) {
      if(query && query!= ''){
        this.loading = true;
        getCustomerOption({keywords:query}).then(response => {
          this.customerList = response;
          this.loading = false;
        }).catch(()=>{
          this.loading = false;
        });
      }
    },
    openFlie(key){
      window.open(this[key])
    },
    seeOrderType(item){
      this.orderTypeForm = JSON.parse(JSON.stringify(defaultorderTypeForm))
      this.orderTypeForm.orderId = item.orderId;
      this.orderTypeForm.orderCustomerType = item.orderCustomerType;
      this.orderTypeShow = true

    },

    handleConfirm4(){
      this.$refs.orderTypeForm.validate((valid) => {
        if (valid) {
          this.orderTypeLoading = true;
          editOrderCustomerType(this.orderTypeForm).then((res)=>{
            this.$message({
              type: 'success',
              message: '操作成功!'
            });
            this.orderTypeLoading = false;
            this.handleClose4();
            this.getList();
          }).catch(()=>{
            this.orderTypeLoading = false;
          })
        }
      })
    },
    handleClose4(){
      this.orderTypeShow = false
    },
    //取消合同
    showCancelOrder(type,item) {
      this.$refs.cancelOrder.showPop(type, item.orderId)
    },
    //申请延期
    applyClosure(item){
      this.$refs.delayClosure.showPop(item)
    },

    //获取订单分类列表
    getOrderCustomerType(){
      getConfigList({status:1}).then((res)=>{
        let orderCustomerType = res.find((el)=>{
          return  el.cdtCode == 'order_customer_type'
        })
        this.orderCustomerTypeList = orderCustomerType ? orderCustomerType.data : []
      })
    },
    //获取事业部列表
    getDivisionDeptList(){
      divisionDeptList().then((res)=>{
        this.divisionList = res
      })
    },
    // 申请更改结算方式
    updateSettlement(type,row) {
      if (type == 'see') {
        this.$refs.updateSettlement.showPop('see',row)
      } else if (type == 'check') {
        this.$refs.updateSettlement.showPop('check',row)
      }
    },
      // 新增售后
      showpop(item){
        let data = {
          customerId:item.customerId,
          customerName:item.customerName,
          orderId:item.orderId,
          orderSn: item.orderSn
        }
        this.$refs.addSh.showPop(data)
      },
      // 取消投委会订单
      setIsEntrust(item){
        let msg = item.isEntrust == 1 ? '确认将此订单取消投委会订单设置?' : '确认将此订单设为投委会订单?'
        this.$confirm(msg, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          changeEntrust({orderId:item.orderId,isEntrust:item.isEntrust == 1 ? 2 : 1}).then(()=>{
            this.getList();
            this.$message({
              type: 'success',
              message: '设置成功!'
            });
          });
        }).catch(() => {});
      },
      //显示推荐人弹窗
      showorderForm(item){
        this.dialogVisibleOrder = true;
        this.orderForm.orderId = item.orderId;
      },
      //关闭关联采购订单弹窗
      handleClose3(){
        this.dialogVisibleOrder = false;
        this.btnLoading3 = false;
        this.orderForm.orderId = '';
        this.orderForm.purchaseOrderSn = '';
      },
      //确认关联采购订单
      handleConfirm3(){
        this.$refs.orderForm.validate((valid) => {
          if (valid) {
            this.btnLoading3 = true;
            guanglianOrderShouXing(this.orderForm).then((res)=>{
              this.$message({
                type: 'success',
                message: '操作成功!'
              });
              this.btnLoading3 = false;
              this.handleClose3();
              this.getList();
            }).catch(()=>{
              this.btnLoading3 = false;
            })
          }
        })
      },
      changeOrderType(item){
        this.$confirm('是否确认将该订单转为质押单?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          let data = {};
          data.orderId = item.orderId;
          data.isEnableYunLink = 1;
          changeOrderShouXing(data).then(()=>{
            this.getList();
            this.$message({
              type: 'success',
              message: '操作成功'
            });
          })
        }).catch(() => {
          this.$message({
            type: 'info',
            message: '已取消操作'
          });
        });
      },
      //获取备注类型
      getRemarkList(){
        getCustomerSetting().then((res) => {
          res.forEach((el) => {
            if (el.cdtCode == 'remark_type_str') {
              this.remarkList = el.data
            }
          });
          })
        },
        //显示推荐人弹窗
        showjieshaoForm(item){
          this.dialogVisible = true;
          this.jieshaoForm.orderId = item.orderId;
          this.jieshaoForm.introducerId = item.introducerId != 0 ? item.introducerId : '';
          customerIntroducerList({ pageNum:1, pageSize:10000, customerId:item.customerId,}).then(response => {
            this.introducerList = response.list;
          })
        },
        //关闭推荐人弹窗
        handleClose(){
          this.dialogVisible = false;
          this.btnLoading2 = false;
          this.jieshaoForm.orderId = '';
          this.jieshaoForm.introducerType = '';
          this.jieshaoForm.introducerName = '';

        },

        //确认推荐人
        handleConfirm(){
          this.$refs.jieshaoForm.validate((valid) => {
            if (valid) {
              this.btnLoading2 = true;
              console.log(this.jieshaoForm)
              setIntroducerInfo(this.jieshaoForm).then((res)=>{
                this.$message({
                  type: 'success',
                  message: '操作成功!'
                });
                this.btnLoading2 = false;
                this.handleClose();
                this.getList();
              }).catch(()=>{
                this.btnLoading2 = false;
              })
            }
          })

        },
        //下载excle
        downloadExcel(){
          let params = JSON.parse(JSON.stringify(this.listQuery));
          params.export = 1;
          saleOrderList(params).then((res)=>{
            require.ensure([], () => {
              const { export_json_to_excel } = require('sheet/Export2Excel');
              const tHeader = res.title;
              const filterVal = res.columns;
              const list = res.list;
              const data = this.formatJson(filterVal, list);
              export_json_to_excel(tHeader, data, res.fileName);
            })
          })
        },

        //下载表格数据格式化
        formatJson(filterVal, jsonData) {
          return jsonData.map(v => filterVal.map(j => v[j]))
        },

        //获取七牛TOKEN
        getUploadToken(){
          getQiniuToken().then((res)=>{
            this.uploadToken.token = res.token;
            this.imgDomain = res.domain
          })
        },
        //上传文件重写
        sliderRequest(upload,item) {
          // 文件上传自行处理上传
          // 创建FormData对象 添加相关上传参数
          const formData = new FormData()
          // 文件对象
          formData.append('file', upload.file)
          // key 文件名处理，这样的话七牛会识别文件时什么类型
          let timestamp=new Date().getTime();
          let fileName = timestamp + upload.file.name
          formData.append('key', fileName)
          // token
          formData.append('token', this.uploadToken.token)//这个postData,要在data数据里面进行定义的，，，我这里调接口使用的是vue的方式
          // 上传文件
          // onUploadProgress 查看axios文档 https://github.com/axios/axios
          axios.post("https://upload.qiniup.com", formData, {
            onUploadProgress: (event) => {
              // 监听上传进度
              event.percent = event.loaded / event.total * 100
              upload.onProgress(event)
            }
          }).then((response) => {
            console.log("response",response)
            if (response.status === 200) {
              let res = response.data;
              console.log(this.imgDomain+res.key);
              this.contractUrl= this.imgDomain+res.key;
              uploadOrderImg({orderId:item.orderId,contractUrl:this.contractUrl}).then((res)=>{
                this.$message({
                  message: '合同附件上传成功',
                  type: 'success'
                });
                this.btnLoading = false;
                this.getList()
              }).catch(()=>{
                this.btnLoading = false;
              })
            }else{
              this.btnLoading = false;
              this.handleAvatarError2()
            }
          }).catch((err) => {
            this.btnLoading = false;
            this.handleAvatarError2()
          })
        },

        //上传图片
        handleAvatarSuccess2(res, file,item){
          this.btnLoading = true;
          if(res.code == 200){
            this.contractUrl= res.content.url;
            uploadOrderImg({orderId:item.orderId,contractUrl:this.contractUrl}).then((res)=>{
              this.$message({
                message: '合同附件上传成功',
                type: 'success'
              });
              this.btnLoading = false;
              this.getList()
            }).catch(()=>{
              this.btnLoading = false;
            })
          }else{
            this.btnLoading = false;
            this.$message({
              message: res.msg,
              type: 'error'
            });
          }
        },
        handleAvatarError2(){
          this.$message({
            message: '上传失败',
            type: 'error'
          });
        },
        //获取订单状态列表
        getOrderStatListData(){
          getOrderStatList().then((res)=>{
            this.orderStateList = res;
          })
        },
          //获取我的部门列表
          getDeptList(){
            myDeptList().then((res)=>{
              this.deptList = res;
            })
          },
          //获取员工下拉选项
          getUserOptionList(){
            getOrderUsersList().then((res)=>{
                  this.userOptionList = res;
              })
          },

          //选择员工名称
          handleSelectUserName(key,item){
              this.listQuery[key] = item.userId;
          },


          //客户名称输入匹配
          querySearch(queryString, cb){
              getCustomerOption({keywords:queryString}).then((res)=>{
                  cb(res);
              })
          },


          //选择客户名称
          handleSelectCustomerName(item){
              this.listQuery.keywords = item.customerName
          },

        /**
         * 切换选择状态
         */
        handleSelect(key, keyPath){
            this.listQuery = JSON.parse(JSON.stringify(defaultListQuery)),
            this.listQuery.tab = key;
            if(key == 'my' || key == 'company'){
              let time = new Date();
              let day = time - time % (24 * 60 * 60 * 1000) - 8 * 60 * 60 * 1000;
              let end = new Date(day + 24 * 60 * 60 * 1000-1000);
              let start = new Date(day - 7*24 * 60 * 60 * 1000);
              let endDate = formatDate(end, 'yyyy-MM-dd hh:mm:ss');
              let startDate = formatDate(start, 'yyyy-MM-dd hh:mm:ss');
              this.listQuery.createTime = [startDate,endDate];
            }
            if(key != 'company'){
              this.listQuery.isSpecialOrder = '';
            }
            this.handleSearchList();
        },
        handleSizeChange(val){
          this.listQuery.pageNum = 1;
          this.listQuery.pageSize = val;
          this.getList();
        },
        handleCurrentChange(val){
          this.listQuery.pageNum = val;
          this.getList();
        },

        handleSearchList(){
          this.listQuery.pageNum = 1;
          this.getList();
        },

        //获取订单列表
        getList() {
          this.listLoading = true;
          let listQuery = JSON.parse(JSON.stringify(this.listQuery));
          if(listQuery.tab != 'company'){
           listQuery.isSpecialOrder = '';
          }
          if(listQuery.isMoresuOnlineOrder != 1){
            listQuery.isMoresuNeedCheck = null;
          }
          saleOrderList(listQuery).then(response => {
            this.tableData = response.list;
            this.count = response.count;
            this.listAmount = response.listAmount;
            this.statisticsAmount = response.statisticsAmount;
            this.statisticsCount = response.statisticsCount;
            this.statisticsGoodsNum = response.statisticsGoodsNum;
            this.listLoading = false;
          }).catch(()=>{
            this.listLoading = false;
          });
        },

        //去详情页
        toDetail(type,item){
          // localStorage.setItem('saleListQuery', JSON.stringify(this.listQuery));
          let routeData = this.$router.resolve({name:'saleDetail',query:{id:item.orderId,type:type}});
          window.open(routeData.href);
          // this.$router.push({name:'saleDetail',query:{id:item.orderId,type:type}})
        },

        //去客户详情页
        toCustomerDetail(item){
          localStorage.setItem('saleListQuery', JSON.stringify(this.listQuery));
          this.$router.push({name:'customerDetail',query:{id:item.customerId}})
        },

      },
    }
</script>

<style scoped lang="scss">
  .upload-div{
    text-align: center;
    position:relative;
    #upload{
      opacity: 0;
      position: absolute;
      z-index: 1;
      width:154px;
      height:40px
    }
  }
  .title-tab{
    border-radius: 8px;
    background: #eee;
    margin-left: 10px;
    display: inline-block;
    vertical-align: middle;
    line-height: 20px;
    padding: 0 5px;
    color: #666;
  }
</style>
